<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>主页</title>
    <link rel="stylesheet" href="/plugins/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/plugins/build/css/app.css" media="all">
</head>
<body>
<div class="container">
    <form class="layui-form custom_search_form" lay-filter="generatorForm" action="" style="padding-top: 10px;">
        <div class="layui-form-item">
            <label class="layui-form-label">目录</label>
            <div class="layui-input-block">
                <input type="text" name="outputPath" value="D:\generatecode\" placeholder="" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">数据库</label>
            <div class="layui-input-block">
                <input type="text" name="dbName" value="" disabled placeholder="" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">数据表</label>
            <div class="layui-input-block">
                <select name="tableName" lay-verify="required" lay-filter="tableInfo">
                </select>
            </div>
        </div>
        <div class="custom_btn_search" style="margin-top: 10px;">
            <button class="layui-btn layui-disabled" lay-submit="" lay-filter="generate" disabled id="generate">生成</button>
        </div>
    </form>
    <table class="layui-table">
        <colgroup>
            <col width="300">
            <col>
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>字段名称</th>
                <th>字段类型</th>
                <th>字段说明</th>
            </tr>
        </thead>
        <tbody id="tableInfoBody"></tbody>
    </table>
</div>
<script src="/plugins/layui/layui.js"></script>
<script src="/plugins/common.js"></script>
<script>
    //自动代码生成链接
    var generatorUrl = SERVER_URL+"/code";
    var generatorInfoUrl = SERVER_URL+"/dbInfo";
    var tableInfoUrl = SERVER_URL+"/tableInfo";

    layui.use(['jquery', 'form','layer'], function() {
        var $ = layui.jquery;
        var form = layui.form;

        //刷新数据表信息
        function refreshTable(tableName){
            if(tableName){
                $("#tableInfoBody").html("");
                $.ajax({
                    type: 'GET',
                    url: tableInfoUrl,
                    data: {tableName: tableName},
                    success: function (result) {
                        if(result.code == 20000){
                            var str = "";
                            var data = result.data.columns;
                            for(var i in data){
                                str += "<tr>";
                                str += "<td>"+data[i].columnName+"</td>";
                                str += "<td>"+data[i].dataType+"</td>";
                                str += "<td>"+data[i].columnComments+"</td>";
                                str += "</tr>";
                            }
                            $("#tableInfoBody").append(str);
                        }else{
                            layer.msg(result.msg, {time: 1500});
                        }
                    }
                });
            }
        }

        //获取数据库信息
        $.ajax({
            type: 'GET',
            url: generatorInfoUrl,
            success: function (result) {
                if(result.code == 20000){
                    $("input[name='dbName']").val(result.data.dbName);
                    $("select[name='tableName']").html("");
                    for(var i in result.data.dbTable){
                        var option = "<option value=\"";
                        option += result.data.dbTable[i];
                        option += "\">";
                        option += result.data.dbTable[i];
                        option += "</option>";
                        $("select[name='tableName']").append(option);
                    }
                    $("#generate").removeAttr("disabled");
                    $("#generate").removeClass("layui-disabled");
                    layui.form.render('select','generatorForm');
                    refreshTable(result.data.dbTable[0]);
                }else{
                    layer.msg(result.msg, {time: 1500});
                }
            }
        });

        //条件搜索
        form.on('submit(generate)', function(data){
            layer.load(1, {
                shade: [0.1,'#fff'],
                time: 5000
            });
            $.ajax({
                type: 'POST',
                url: generatorUrl,
                data: data.field,
                success: function (result) {
                    layer.closeAll();
                    if(result.code == 20000){
                        layer.msg('数据生成成功', {icon: 1,time: 1000})
                    }else{
                        layer.msg(result.msg, {time: 1500});
                    }
                }
            });
            return false;
        });

        //数据表选择事件
        form.on('select(tableInfo)', function(data){
            refreshTable(data.value);
        });
    });
</script>
</body>
</html>